import React from 'react'
import { history } from 'umi'

const Person = (props: any) => {
  const id = 1
  const goIndex = () => {
    history.push('/')
  }
  const showMale = () => {
    history.push('/person/male')
    // history.push(`/person/male/${id}`)
    // history.push(`/person/male/?id=${id}`)
    // history.push({pathname: '/person/male', query: { name: String(id) }})
    // history.push({pathname: '/person/male', state: { name: id }})
  }
  const showFemale = () => {
    history.push('/person/female')
  }
  return (
    <>
      <div>
        <h1>我是Person</h1>
        <button onClick={goIndex}>GO Index</button>
      </div>
      <br />
      <button onClick={showMale}>show Male</button>&nbsp;&nbsp;
      <button onClick={showFemale}>show Female</button>
      {/* { props.children } */}
      {
        React.Children.map(props.children, child => {
          return React.cloneElement(child, { foo: { name: id }, bar: 222 });
        })
      }
    </>
  )
}

export default Person